﻿<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <title>Image Gallery</title>

<style>
h1 {
  font-size: large;
  font-family: Verdana;
  margin-left: 30px;
}

.gallery {
  margin: 0px 30px 0px 30px;
  background: #D8EEFE;
  padding: 10px;
}

.gallery img {
  margin: 5px;
  padding: 5px;
  width: 75px;
  border: solid 1px black;
  -webkit-transition: all 1s ease 0s;
  transition: all 1s ease 0s;
  background: white;
}

.gallery img:hover {
  -webkit-transform: scale(2.2) rotate(10deg);
  transform: scale(2.2) rotate(10deg);
}
</style>


</head>

<body>
<h1>Cute Animal Page</h1>
<div class="gallery">
<img src="bunny.jpg">
<img src="cat.jpg">
<img src="dog.jpg">
<img src="platypus.jpg">
<img src="goose.jpg">
</div>

</body>
</html>
